<template>
  	<div id="myDown">
  		<header>
  			<i @click="goBack()"></i>
  			<div>我的下载</div>
  		</header>
  		<div class="border-8"></div>
		<ul class="list">
			<div class='mc' v-if="list.length<1">
  				<!-- <img src="../../image/no_collection@2x.png" width='110' alt=""> -->
  				<p>暂无下载!</p>
	  		</div>
	  		<Loadmore
				:top-method="loadTop"
				:bottom-method="loadBottom"
                :bottom-all-loaded="allLoaded"
                ref="loadmore"
                :autoFill="false"
			>
			<li v-for="x in list">
				<router-link :to="{ name: 'myDownManage', query: { title: '预防蛀牙的有效措施有哪些方法'}}">
	  				<img src="../../img/4de25b51-1ab1-4c70-8a82-e765a0c7efbb.jpg" width="117" height="77" />
	  				<div>
	  					<div>
		  					<h3>预防蛀牙的有效措施有哪些方法</h3>
	  					</div>
	  					<p>主讲老师:金老师</p>
	  					<span>
	  						已缓存2节
	  					</span>
	  				</div>
  				</router-link>
			</li>
			</Loadmore>
		</ul>
	</div>
</template>
<script>
	import {Loadmore} from 'mint-ui';
	export default {
		data() {
			return {
				list: [1],
				userid: '',
				sentPage: {
					page: 1,
					rows: 10
				},
				allLoaded: false,
				totalNum: 0, 	//总数据条数
			}
		},
		components: {
			Loadmore
		},
		methods: {
			goBack() {
				this.$router.push({path:'/my'})
			},
			//获取下载课程列表
            getDownCourse(params) {
                this.userid = localStorage.getItem("loginMobile");
                // 第一个参数是root--baseurl

                this.$api.post(this.$api.baseURLSchool,"selecttype/user_relative/0?user_id="+this.userid+"&type=download&type_name=download&name=123&rel_id=1",params,r => {
                    console.log(r);
                    this.totalNum = r.data.records;
					if(this.sentPage.page==1) {
						// this.list = r.data.rows;
					}else {
						// this.list = this.list.concat(r.data.rows);
					}
					if(r.data.rows.length == 0&&this.sentPage.page>1) {
						this.$utils._toast("暂无更多数据");
                    }
                    if(this.totalNum == this.list.length) {
                        this.allLoaded = true;
                    }

                },err => {
                    console.log(err);
                })
            },
            //下拉刷新
			loadTop() {
				this.sentPage.page =1;
			  	setTimeout(() => {
		        	this.getDownCourse(this.sentPage);
		        	this.allLoaded = false;
		        }, 20);
			  	this.$refs.loadmore.onTopLoaded();
			},
			//上拉加载
			loadBottom() {
				(this.sentPage.page)++;
		        setTimeout(() => {
		        	this.getDownCourse(this.sentPage);
		        }, 20);
		        if(this.totalNum == this.list.length) {
					this.allLoaded = true;
		        }
				this.$refs.loadmore.onBottomLoaded();
			}


		},
		created() {
			this.getDownCourse();
		}
	}
</script>
<style lang="scss" scoped>
	.mc {
		padding: 40px 0;
		margin: auto;
		position: absolute;
		left: 50%;
		top: 40%;
		transform: translate(-50%,-50%);
		img {
			display: block;
			margin: 0 auto;
		}
		p {
			padding-top: 10px;
			text-align: center;
		}
	}
</style>
